
<@c.html>
<div class="panel panel-_default">
    <div class="panel-heading">
        <h1 class="panel-title" style="font-size: 28px;">
            <i class="fa fa-database" style="font-size: 28px;"></i>
            数据字典
        </h1>
    </div>
    <div class="panel-body">
        <div class="row">
            <form class="form-inline" id="query-form">
                        <div class="form-group">
                            <label class="control-label">字典名称</label>
                            <input type="text" class="form-control" id="name" name="name" creation="like"/>
                        </div>
                        <div class="form-group">
                            <label class="control-label">字典编码</label>
                            <input type="text" class="form-control" id="code" name="code" creation="like"/>
                        </div>
                <button class="btn btn-success" type="button" id="search">
                    <i class="glyphicon glyphicon-search"></i>查询
                </button>
            </form>
        </div>
        <div class="row">
            <table id="table"></table>
            <div id="toolbar">
                <a href="./addView" class="btn btn-success">新增</a>
                <button class="btn btn-success" id="delete">删除</button>
            </div>
        </div>
    </div>
</div>
</@c.html>
<script type="application/javascript">
    $(function(){
        $('#table').bootstrapTable({
            url: '.',
            columns: [{
                field: 'ck',
                checkbox: true
            },{
                field: 'id',
                title: 'id'
            },{
                field: 'name',
                title: '字典名称'
            },{
                field: 'code',
                title: '字典编码'
            }],
            pagination: true,
            sidePagination: 'server',
            paginationLoop: false,
            toolbar: "#toolbar",
            showToggle : true,
            striped: true,
            cache : false,
            idField: "id",
            showRefresh : true,
            clickToSelect : true,
            onDblClickRow: update
        });

        $("#search").click(function(){
            var params = {};
            $.each($("#query-form").serializeArray(), function(i, data) {
                var creation = $("#query-form").find('*[name="' + data.name + '"]').attr("creation");
                params[data.name] =  creation + "," + data.value;
            });
            $('#table').bootstrapTable('refresh', {query : params});
        });

        $('#delete').click(function(){
            var selections = $('#table').bootstrapTable("getSelections");
            if(selections.length == 0) return;

            var ids = [];
            $.each(selections, function(i, selection){ids.push(selection.id)});

            $.ajax({
                type : "delete",
                url : '.?ids=' + ids.join(","),
                contentType:"json",
                success:function (result) {
                    console.log(result);
                    $('#table').bootstrapTable('refresh');
                },
                error:function(xmlHttpRequest , message,  error){
                    console.log(message);
                }
            });
        })

        function update(row, $element, field){
            window.location.href = "./updateView?id=" + row.id;
        }
    });

</script>